@charset "utf-8";
//Ctrl+Shift+L多行编辑
@mixin toolbar-item($pos, $hoverPos) {
	background-position: 0 $pos;
	&:hover {
		background-position: 0 $hoverPos;
	}	
}

$toolbar-size: 52px;
.toolbar-item, .toolbar-layer{
	background-image: url(../img/toolbar.png);
	background-repeat: no-repeat;
}
.toolbar{
	position: fixed;
	left: 50%;
	bottom: 5px;
	margin-left: -$toolbar-size / 2;
}
.toolbar-item{
	position: relative;
	display: block;
	width: $toolbar-size;
	height: $toolbar-size;
	margin-top: 1px;
	@include transition(background-position 1s);

	&:hover{
		.toolbar-layer{
			@include opacity(1);
			@include scale(1);
		}
	}
}
.toolbar-item-weixin{
	@include toolbar-item(-798px,-860px);
	.toolbar-layer{
		height: 212px;
		background-position:0 0;
	}
}
.toolbar-item-feedback{
	@include toolbar-item(-426px,-488px);	
}
.toolbar-item-app{
	@include toolbar-item(-550px,-612px);	
	.toolbar-layer{
		height: 194px;
		background-position:0 -222px;
	}		
}
.toolbar-item-top{
	@include toolbar-item(-674px,-736px);	
}
.toolbar-layer{
	position: absolute;
	right: $toolbar-size - 6;
	bottom: -10px;
	width: 172px;
	@include opacity(0);
	@include transform-origin(95% 95%);
	@include scale(0.01);
	@include transition(all 1s);
}